import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';

import 'package:get/get.dart';
import 'package:getwidget/components/tabs/gf_tabbar.dart';
import 'package:getwidget/components/tabs/gf_tabbar_view.dart';
import 'package:getwidget/components/tabs/gf_tabs.dart';

import '../controllers/gftab_controller.dart';

class GftabView extends StatefulWidget {
  GftabView({Key? key}) : super(key: key);

  @override
  _GftabViewState createState() => _GftabViewState();
}

class _GftabViewState extends State<GftabView> with SingleTickerProviderStateMixin {
  late TabController tabController;

  @override
  void initState() {
    super.initState();
    tabController = TabController(length: 3, vsync: this);
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('选项卡'),
        centerTitle: true,
      ),
      body: Container(
        child: ListView(
          children: [
            GFTabBar(
              length: 3,
              controller: tabController,
              tabs: [
                Tab(
                  icon: Icon(Icons.directions_bike),
                  child: Text(
                    "Tab1",
                  ),
                ),
                Tab(
                  icon: Icon(Icons.directions_bus),
                  child: Text(
                    "Tab2",
                  ),
                ),
                Tab(
                  icon: Icon(Icons.directions_railway),
                  child: Text(
                    "Tab3",
                  ),
                ),
              ],
            ),

            GFTabBarView(
              controller: tabController,
              height: 200,
              children: <Widget>[
                Container(child: Text('Tab1'), color: Colors.cyan),
                Container(child: Text('Tab2'), color: Colors.green),
                Container(child: Text('Tab3'), color: Colors.orange)
              ]
            ),

            GFTabs(
              length: 3,
              controller: tabController,
              tabs: <Widget>[
                Tab(
                  icon: Icon(Icons.directions_bike),
                  child: Text(
                    "Tab1",
                  ),
                ),
                Tab(
                  icon: Icon(Icons.directions_bus),
                  child: Text(
                    "Tab2",
                  ),
                  ),
                  Tab(
                    icon: Icon(Icons.directions_railway),
                    child: Text(
                      "Tab3",
                    ),
                  ),
              ],
              tabBarView: GFTabBarView(
                controller: tabController,
                children: <Widget>[
                  Container(child: Icon(Icons.directions_bike), color: Colors.cyan,),
                  Container(child: Icon(Icons.directions_bus), color: Colors.green,),
                  Container(child: Icon(Icons.directions_railway), color: Colors.orange,),
                ],
              ),
            ),
          ],
        ),
      ),
      bottomNavigationBar: GFTabBar(
       length: 3,
        controller: tabController,
        tabs: [
          Tab(
            icon: Icon(Icons.directions_bike),
            child: const Text(
              'Tab1',
            ),
          ),
          Tab(
            icon: Icon(Icons.directions_bus),
            child: const Text(
              'Tab2',
            ),
          ),
          Tab(
            icon: Icon(Icons.directions_railway),
            child: const Text(
              'Tab3',
            ),
          ),
        ],
      ),
    );
  }

  @override
  void dispose() {
    tabController.dispose();
    super.dispose();
  }
}

// class GftabView extends GetView<GftabController> {
//   @override
//   Widget build(BuildContext context) {
//     return Scaffold(
//       appBar: AppBar(
//         title: Text('选项卡'),
//         centerTitle: true,
//       ),
//       body: Container(
//         child: Text(
//           'GftabView is working',
//           style: TextStyle(fontSize: 20),
//         ),
//       ),
//     );
//   }
// }
